const CompressionWebpackPlugin = require('compression-webpack-plugin') // gzip压缩
const express = require('express')
const app = express()

var panghu = require('./static/panghu')  //本地json文件数据

var apiRoutes = express.Router();
app.use('/api', apiRoutes)
module.exports = {
	devServer: {
		before(app) {
				app.get('/api/panghu', (req, res) => {
						res.json({
								errno: 0,   // 这里是你的json内容
								data: panghu
						})
				})
		},
		open: process.platform === 'darwin',
		host: '0.0.0.0',
		port: 8080,
		https: false,
		hotOnly: false,
		proxy: null      //设置跨域，即将本文件内任何没有匹配到的静态文件，都指向跨域地址
},
	publicPath: './',	
	// outputDir: '',
	assetsDir: 'static',
	lintOnSave: false,
	productionSourceMap: false,
	chainWebpack: config => {
		// 删除预加载
		config.plugins.delete('prefetch')
		config.plugins.delete('preload')
		// 压缩代码
		config.optimization.minimize(true)
		// 分割代码
		config.optimization.splitChunks({
			chunks: 'all'
		})
	},
	configureWebpack: config => {
		// 生产环境相关配置
		if (process.env.NODE_ENV !== 'development') {
			config.performance = {
				hints: 'warning',
				//入口起点的最大体积 整数类型（以字节为单位）
				maxEntrypointSize: 50000000,
				//生成文件的最大体积 整数类型（以字节为单位 300k）
				maxAssetSize: 30000000,
				//只给出 js 文件的性能提示
				assetFilter: function(assetFilename) {
					return assetFilename.endsWith('.js');
				}
			}
			// gzip压缩
			const productionGzipExtensions = ['html', 'js', 'css']
			config.plugins.push(
				new CompressionWebpackPlugin({
					filename: '[path].gz[query]',
					algorithm: 'gzip',
					test: /\.js$|\.html$|\.json$|\.css/,
					threshold: 10240, // 只有大小大于该值的资源会被处理 10240
					minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理
					deleteOriginalAssets: false // 删除原文件
				})
			)
			// 公共代码抽离
			config.optimization = {
				splitChunks: {
					cacheGroups: {
						vendor: {
							name: 'vendor',
							chunks: 'all',
							test: /[\\/]node_modules[\\/]/,
							minChunks: 2,
							maxInitialRequests: 5,
							minSize: 0,
							priority: 10
						},
						common: {
							name: 'common',
							chunks: 'all',
							test: /[\\/]src[\\/]js[\\/]/,
							minChunks: 2,
							maxInitialRequests: 5,
							minSize: 0,
							priority: 20
						},
						styles: {
							name: 'styles',
							chunks: 'all',
							test: /\.(sa|sc|c)ss$/,
							enforce: true
						},
						runtimeChunk: {
							name: 'manifest'
						}
					}
				}
			}
		}
	},
	css: {
		extract: true
	}
}
